<!-- 促销计划 -->
<template name='sales_plan'>	
<view style="display: flex;    height: 100%;">
	<!-- 商品信息-右边 -->
	<view class="box-infos font14 " >
		
		<view class="content-box " >
			<view class="boxsss40" >
				<!-- 增加、删除 -->
				<view class="top-but">
					<view class="top-but-box">
						<view @click="addShow('')" class="add_color but-add" >
							<img src="../../static/img/add.png" class="img"></img>
							增加计划
						</view>
						<text selectable="true"  class="tipss">用于商城的秒杀板块</text>
						<view @click="$common.noMultipleClicks('fun_plan_list',fun_plan_list,true)" 
						class="rightButttom" 
						>
							<img src="../../static/img/update.png" class="img"></img>
							刷新
						</view>
					</view>
				</view>
				<!-- 列表区 -->
				<table v-if="resData.list!=undefined && resData.list.length>0">
					<!-- 表头 -->
					<thead>
						<tr >
							<th  class="centers " style="min-width: 20px;">
								序
							</th>
							<th  >
								计划名
							</th>
							<th  class=" ">
								商品
							</th>
							<th  class=" ">
								备注
							</th>
							<th  class="centers">
								原价
							</th>
							<th  class="centers">
								促销价
							</th>
							<th  class="centers">
								状态
								<!-- 正新、暂停、缺货 -->
							</th>
							<th  class="centers">
								操作者
							</th>
							<th  class="centers ">
								操作
							</th>
						</tr>
					</thead>
					<tbody>
						<!-- 内容 -->
						<tr  
						:key="index" 
						@click="TabcheckedIndex=index"
						v-for="(item,index) in resData.list" 
						:class="TabcheckedIndex == index ? 'goods-list-select':''"
						:style="item.status==1 ?'color: #e40318;':''"
						>
							<td  class="centers ">
								{{index+1}}
							</td>
							<td   class=" " >
								{{item.nickname}}
							</td>
							<td   @click="pageSend.value=item.goods.id,$refs.pageGoods.open()">
								{{item.goods.name}}
							</td>
							<td   class="">
								{{item.descs}}
							</td>
							<td   class="centers" >
								￥{{item.goods.pifajia}}
							</td>
							<td   class="centers">
								￥{{item.money}}
							</td>
							
							<td  class="centers  status0  " v-if="item.status==1 && item.start_time >resData.now_time" >
								未到时间
							</td>
							<td class="centers  status1 font12" v-if="item.status==1 && item.start_time <= resData.now_time">
								<countdown
								style="margin-left: auto;" 
								:startTime="resData.now_time" 
								:endTime="item.end_time" 
								v-if="item.status==1 && item.start_time <= resData.now_time" 
								/>
							</td>
							<td class="centers  status2 centers" v-if="item.status==2">
								已停止
							</td>
							<td class=" status2 centers" >
								{{item.uid_name}}
							</td>
							<td class="centers " >
								<view @click="addShow(item)" class="margin alter centers">
									详细
								</view>
							</td>
						</tr>
					</tbody>
				</table>
				<!-- 暂无数据 -->
				<empty v-if="resData.list==undefined || resData.list.length==0"></empty>
				<!-- end -->
			</view>
			<!-- 分页 -->
			<pages 
			:sum="page.sum"
			:current="page.nowPage"
			@updatePage="AddUpdatePage"
			></pages>
			<!-- end -->
		</view>
		<!-- end -->
		
		<!-- 增加/修改 客户 遮罩层 -->
		<uni-popup ref="popup" type="center" title="新增促销计划" minWidth="auto">
			<uni-section class="mb-10" title="设置" type="line" >
				
				<view class="absolute">
					<view  >活动状态：</view>
					<switch @change="(res)=>{changeStatus(res,add.update_id)}" :checked="add.data.status==1" style="border-radius:0px"/>
				</view>
				<view class="add-goods floatleft" style="flex:1">
					<view class="riskTitle">计划名称：</view>
					<input
					v-model="add.data.nickname" 
					class="search-ipu" placeholder-class="placeholder-class" />
				</view>
				
				<view class="add-goods floatleft" style="flex:1">
					<view class="riskTitle">活动时间：</view>
					<view class="input_confirms "style="margin-left: 0px;">
						<uni-datetime-picker type="daterange" class="date-box color-e40318"
						v-model="add.data.date"
						:clear-icon="false" 
						></uni-datetime-picker>
					</view>
				</view>
				
				<view class="add-goods floatleft" >
					<view class="riskTitle">选择商品：</view>
					
					<view class="search-ipu justify" @click="openSearchGoods">
						{{add.data.goods_name}}
					</view>
					<view style="color: red;margin-left: 5px;" v-if="add.data.goods_name.length>0">原价￥{{add.goodsSearch.goods.pifajia}}</view>
				</view>
					
				<view class="add-goods floatleft" >
					<view class="riskTitle">促销价格：</view>
					<input 
					v-model="add.data.money" 
					type="number"
					class="search-ipu" placeholder-class="placeholder-class" />
					
					<view style="color: red;margin-left: 5px;" v-if="add.data.goods_name.length>0">
						利润￥
						{{Math.round((add.goodsSearch.goods.pifajia - add.data.money)*100)/100}}
					</view>
				</view>
				<view class="add-goods floatleft" style="flex:1">
					<view class="riskTitle">其他备注：</view>
					
					<input
					v-model="add.data.descr" 
					class="search-ipu" placeholder-class="placeholder-class" />
				</view>
					
				
			</uni-section>
		
			
			
	
			
		
	
			
			<view class="but-box">
				<view class="but-boxs">
					<view @click="$refs.popup.close"  class="add-but-close">
						取 消
					</view>
					<view @click="$common.noMultipleClicks('fun_plan',fun_plan)"  class="add-but-com">
						确定
					</view>
				</view>
			</view> 
		</uni-popup>
		<!-- end -->
		
		<!-- 选择商品 遮罩层 -->
		<uni-popup ref="goods" type="center" title="选择商品">
			<!-- 数据列表 -->
			<view class="box-infos font12  " >
				
				<view class="content-box " >
					<view class="boxsss40" >
						<view class="add-box">
							<view class="add-goods floatleft">
								<view class="riskTitle">搜索商品关键字</view>
								
								<input 
								v-model="add.goodsSearch.value" 
								@confirm="GetGoodsSearch(true)"
								@input="GetGoodsSearch(true)"
								class="search-ipu" placeholder-class="placeholder-class" />
							</view>
							<view @click="$common.noMultipleClicks('GetGoodsSearch',GetGoodsSearch,true)"  class="add-but-com">
								<img src="../../static/img/search.png" class="ico"></img>
								搜索
							</view>
						</view>
						
						<!-- 列表内容 -->
						<table v-if="add.goodsSearch.list.length>0">
							<!-- 表头 -->
							<thead>
								<tr >
									<th  class="centers " >
										序
									</th>
									<th  >
										商品
									</th>
									<th  class=" ">
										库存
									</th>
									<th  class=" ">
										批发价
									</th>
									<th  class=" ">
										操作
									</th>
								</tr>
							</thead>
							<tbody>
								<!-- 内容 -->
								<tr  
								:key="index"
								:class="{'color-e40318':item.margin<=0}"
								v-for="(item,index) in add.goodsSearch.list"
								>
									<td  class="centers ">
										{{index+1}}
									</td>
									<td   class=" " >
										{{item.name}}
									</td>
									<td   
									:style="{color:parseInt(item.margin)>0  ? '#2ab100':'#ff0000'}"
									>
										{{item.margin}}
									</td>
									<td   class="">
										￥{{item.pifajia}}
									</td>
									<td   class=""  @click="selectListIndex(item)">
										选择
									</td>
								</tr>
							
							</tbody>
						</table>
						
					</view>
				
				
					<!-- 暂无数据 -->
					<empty v-if="add.goodsSearch.list.length==0"></empty>
					<!-- end -->
					<pages 
					:sum="add.page.sum"
					:current="add.page.nowPage"
					@updatePage="AddUpdatePage"
					></pages>
			
				</view>
			</view>
			<!-- 数据列表end -->
		</uni-popup>
		<!-- end -->
		
		<!-- 商品页面 -->
		<uni-popup ref="pageGoods" type="center" :title="pageSend.value">
			<shopping_admin :isPop="false" :OnPageSearchGoodsId="pageSend.value" class="h100"></shopping_admin>
		</uni-popup>
		<!-- end -->
		
	</view>
</view>
</template>

<script>
	import empty from "@/components/admin-components/empty.vue"
	import pages from "@/components/admin-components/pages.vue"
	import countdown from "@/components/cz-countdown/cz-countdown"
	import shopping_admin from "@/components/goods/goods.vue"
	export default{
		name:'sales_plan',
		components: {
			empty,pages,countdown,shopping_admin
		},
		data(){
			return{
				pageSend:{
					value:''
				},
				TabcheckedIndex:-1,//当前选中项
				resData:{},
				add:{
					goodsSearch:{
						value:'',
						goods:{},
						list :[],
					},
					update_id:'',//修改计划的id
					data:{//欲要提交的商品
						goods_id:'',//计划商品
						start_time:'',//开始时间
						end_time:'',//结束时间
						money:'',//计划金额
						descr:'',//计划备注
						status:'',//计划状态
						date:'',//计划时间
						goods_name:'',//计划名称
						nickname:'',//计划名称
					},
					page:{
						
						nowPage:1,//当前页数
						pageCount:1,//总页数
						maxCount:0,
						sum:0,
						pageCounts:15,
					},
				},
			
				page:{
					
					nowPage:1,//当前页数
					pageCount:1,//总页数
					maxCount:0,
					sum:0,
					pageCounts:15,
				},
			}
		},
		 // 此处定义传入的数据
		props: {
			OnPageSearchId: {
				type: String,
				default:''
			}
		},
		mounted(){
		},
		created() {
			this.fun_plan_list(true)
		},
		methods:{
			
		
			
			/**
			 * 活动-开关
			*/
			changeStatus(res,id){
				var that = this
				var status = res.detail.value==true? 1:2;
				if(id && id.length>0){
					this.add.data.status = status
					that.$common.get_request(
						{
							type:'plan_status',
							status:status,
							id:id
						},
						(res)=>{
							that.$common.showModal('提示',res.msg)
							that.fun_plan_list(true)
						},
						(res)=>{
							if(res && res.code!=0){
								that.add.data.status = 2
							}
						}
					);
				}
			},
		
			
			timestampToTime(timestamp) {
			  // 时间戳为10位需*1000，时间戳为13位不需乘1000
			  var date = new Date(timestamp * 1000);
			  var Y = date.getFullYear() + "-";
			  var M =
			    (date.getMonth() + 1 < 10
			      ? "0" + (date.getMonth() + 1)
			      : date.getMonth() + 1) + "-";
			  var D = (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
			  
			  return Y + M + D ;
			},
			/**
			 * 打开搜索商品窗口
			*/
			openSearchGoods(){
				if(this.add.update_id!=''){
					this.$common.toast("修改计划的时候不允修改商品，如需修改商品可创建新的计划")
					return
				}
				
				if(this.add.goodsSearch.list.length==0){
					this.GetGoodsSearch()
				}
				
				this.$refs.goods.open()
			},
			/**
			 * 打开增加、修改窗口
			 * update_id : 可能为空；即是新增
			*/
			addShow(item){
				let that = this
				if(item.id && item.id!=""){
					//把需要编辑的内容赋值到弹出窗处
					that.add.update_id = item.id
					that.add.data.date = []
					that.add.data.date.push(that.timestampToTime(item.start_time))
					that.add.data.date.push(that.timestampToTime(item.end_time))
					that.add.data.descr= item.descs
					that.add.data.end_time= ''
					that.add.data.goods_id= item.goods_id
					that.add.data.goods_name= item.goods.name
					that.add.data.money= item.money
					that.add.data.start_time= ''
					that.add.data.status= item.status
					that.add.goodsSearch.goods.pifajia = item.goods.pifajia
					that.add.goodsSearch.goods.jinhuojia = item.goods.jinhuojia
					that.add.data.nickname= item.nickname
					
				
				}else{
					that.add.update_id = ''
					
					that.add.data.date = []
			
					that.add.data.descr= ''
					that.add.data.end_time= ''
					that.add.data.goods_id= ''
					that.add.data.goods_name= ''
					that.add.data.money= ''
					that.add.data.start_time= ''
					that.add.data.status= ''
					that.add.goodsSearch.goods.pifajia = ''
					that.add.goodsSearch.goods.jinhuojia = ''
				}
				that.$refs.popup.open()
			},
			
			/**
			 * 分页器回调
			*/
			AddUpdatePage(pageName,pageCount){
				var that = this
				that.add.page.nowPage = pageName
				that.add.page.pageCounts = pageCount
				that.GetGoodsSearch(false)
			},
			/**
			 * 搜索商品
			*/
			GetGoodsSearch(isUpdatePage=true){
				var that = this
				that.add.page.nowPage = isUpdatePage == true ? 1:that.add.page.nowPage;
				that.$common.get_request(
					{
						type:'goods_list',
						search:that.add.goodsSearch.value,//搜索内容
						pages:that.add.page.nowPage,//当前位于页数
						page_count:that.add.page.pageCounts,//当前请求页的数量
					},
					(res)=>{
						that.add.goodsSearch.list = res.list
						
						that.add.page.pageCount  = res.pageCount
						that.add.page.sum  = res.sum
						if(isUpdatePage == true){
						that.add.page.nowPage  = 1
						}
						that.add.page.maxCount  = res.maxCount
					}
				);
			},
			/**
			 * 选中商品
			 * type : goods_list|goods_search
			*/
			selectListIndex(item){
				if(item.mp_grounding!=1){
					uni.showModal({
						title:'所选择的商品未上架至商城',
						content:'请在仓库管理->商品管理页面中将商品上架；',
						showCancel:false,
					})
					return
				}
				this.add.goodsSearch.goods = item
				this.add.data.goods_id = item.id
				this.add.data.goods_name = item.name
				this.$refs.goods.close()
			},
			/**
			 * 分页器回调
			*/
			updatePage(pageName,pageCount){
				var that = this
				that.page.nowPage = pageName
				that.page.pageCounts = pageCount
				that.fun_plan_list(false)
			},
			/**
			 * 读取
			*/
			fun_plan_list(isUpdatePage=true){
				var that = this
				that.page.nowPage = isUpdatePage == true ? 1:that.page.nowPage;
				that.$common.get_request(
					{
						type:'getPlan',
						pages:that.page.nowPage,//当前位于页数
						page_count:that.page.pageCounts,//当前请求页的数量
						plan_id:that.OnPageSearchId
					},
					(res)=>{
						that.resData = res
						that.page.sum  = res.sum
						if(isUpdatePage == true){
						that.page.nowPage  = 1
						}
						
					}
				);
			},
			
			/**
			 * 保存、修改方法
			*/
			fun_plan(){
				var that = this
				if(that.add.data.date.length<2){
					that.$common.toast("请选择计划的时间后再试")
					return
				}
				if(that.add.data.money.length==0){
					that.$common.toast("请输入计划 销售价格 后再试")
					return
				}
				// if(that.add.data.status.length==0){
				// 	that.$common.toast("请输入计划 状态 后再试")
				// 	return
				// }
				
			
				let data  = that.add.data
				
				data.update_id = that.add.update_id
				data.start_time = that.add.data.date[0]
				data.end_time = that.add.data.date[1]
				data.type = that.add.update_id==''?'plan_sva':'plan_update'
				
				that.$common.get_request(
					data,
					(res)=>{
						that.$refs.popup.close()
						that.fun_plan_list(true)
					}
				);
			},
			
		}
	}
</script>

<style>
	.absolute{
		position: absolute;
		top: 20px;
		right: 10px;
		width: auto;
		min-width: auto;
		padding: 5px;
		display: flex;
		flex-direction: row;
		align-items: center;
		z-index:1;
	}
</style>
